<template>
  <div>
    <px-tabs v-model="activeWater" class="equipment-tabs" style="padding-left: 24px; background: white">
      <px-tab-pane v-for="(item, index) in tabPaneList" :key="index" :name="item.name">
        <template #label>
          <p class="pane-bottom">{{ item.label }}</p>
          <p class="pane-line" />
        </template>
      </px-tab-pane>
    </px-tabs>
    <liquid v-if="activeWater == 'liquid'" :classCode="'WATER'" />
    <solidity v-if="activeWater == 'solidity'" :classCode="'WATER'" />
  </div>
</template>

<script setup lang="ts">
import { getCurrentInstance, ref, toRefs, reactive, onMounted } from "vue";
import liquid from "../liquid/index.vue";
import solidity from "../solidity/index.vue";
const activeWater = ref("liquid");
const tabPaneList = [
  {
    label: "废液",
    name: "liquid"
  },
  {
    label: "固废",
    name: "solidity"
  }
];
</script>
